<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>P2Ro Control Panel</title>
    <script type="text/javascript" src="jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/screen.css" media="screen, projection" />
    <link rel="stylesheet" type="text/css" href="css/print.css" media="print" />
    <!--[if lt IE 8]>
    <link rel="stylesheet" type="text/css" href="css/ie.css" media="screen, projection" />
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="css/main.css" />
    <link rel="stylesheet" type="text/css" href="css/form.css" />
    <!-- Include jQuery-->
    <script src="http://code.jquery.com/jquery-2.0.0.min.js"></script>
</head>
<style>
    body
    {
        background-image:url('images/iCloudTexture.jpg');
        background-repeat: repeat;
    }
    #box {
        position: relative;
        background-color: white;
        width: 960px;
        height: 600px;
        margin: 40px auto;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.2),
        0 1px 1px rgba(0, 0, 0, .2),
        0 3px 0 #fff,
        0 4px 0 rgba(0, 0, 0, .2),
        0 6px 0 #fff,
        0 7px 0 rgba(0, 0, 0, .2);
    }
    #box:after {
        content: '';
        position: absolute;
        border: 1px dashed #ccc;
        top: 5px;
        bottom: 5px;
        left: 5px;
        right: 5px;
        -moz-box-shadow: 0 0 0 1px #fff;
        -webkit-box-shadow: 0 0 0 1px #fff;
        box-shadow: 0 0 0 1px #fff;
    }
    .menuLeft {
        padding-left: 6px;;
    }
    .menuLeft li {
        list-style: none;.
    }
</style>
<body>
<div class="container" id="page">
    <div id="box">
        <div style="margin:0px auto;width:920px;padding: 10px;border-bottom: 1px dashed #ccc;height: 20px;line-height: 26px; ">
            <span style="text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);font-size: 18px;font-weight: bolder;">P2Ro Control Panel</span>
            <span style="float: right;text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);">User Online : <font color=#006400>1791</font></span>
            <span style="float: right;text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);">Char Server : <font color=#006400>Online</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
            <span style="float: right;text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);">Login Server : <font color=#006400>Online</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
            <span style="float: right;text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);">Map Server : <font color=#006400>Online</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
        </div>
        <div style="padding: 10px 6px 10px 16px; margin: 0px auto;">
            <div style="float: left;width: 160px;border-right: 1px dashed #ccc;height: 530px;">
                <ul class="menuLeft">
                    <li>Exp & Job Rate</li>
                    <li>Drop Rate</li>
                    <li>Drop</li>
                </ul>
            </div>
            <div style="float: left;padding-left:10px; width: 750px;">R</div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function() {

    });
</script>
</body>
</html>